<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>RabbitMQ高并发秒杀</title>
    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/jquery.countdown.min.js}"></script>
    <script th:src="@{/js/sec.js}"></script>
    <script type="text/javascript">
        $(function () {
            // 获取 商品id , 当前时间 , 开始时间 , 结束时间等数据
            var goodsId = [[${goods.id}]];
            var nowTime = [[${nowTime}]];
            var startTime = [[${goods.startTime.getTime()}]];
            var endTime = [[${goods.endTime.getTime()}]];
            seckill.func.init(goodsId, nowTime, startTime, endTime);
        })
    </script>
</head>

<body th:inline="text">

<div th:style="'margin:auto; background-color: whitesmoke; width: 1202px; height: 45px; line-height: 45px;'">
    <div style="margin:auto; float:left; width:1000px;">
        主题频道
        生活助手
        会员服务
        更多热点
        商家入驻
    </div>
    <div style="margin:auto; float:left; width:200px;">
        请登录
        请注册
        商家入驻
    </div>
</div>

<div id="content" style="margin:auto; width:1202px;">

    <div style="margin: 10px; height: 75px; line-height: 75px;">
        <div style="float: left; line-height: 50px;"><img th:src="@{/image/logo.png}"></div>
        <div style="float: left; width: 170px;">&nbsp;</div>
        <div style="float: left;line-height: 50px;"><input type="text" style="width: 430px; height: 40px;">&nbsp;&nbsp;搜索
        </div>
    </div>
</div>

<div style="margin:0 auto; width:1202px;">

    <!--左侧的div-->
    <div style="float: left;margin: 18px;">
        <img th:src="${goods.imageUrl}">
    </div>

    <!--右侧的div-->
    <div style="float: left;margin: 18px;">
        <p>
            [[${goods.name}]] [[${goods.nameDesc}]]
        </p>
        <p>
            <span style="color: red;font-size:20px;font-weight: bold;">[[${goods.price}]]</span>
        </p>
        <p>
            剩余：[[${goods.store}]] 件
        </p>

        <br/>
        <p id="seckillTip">
            <!--显示秒杀按钮的区域或者倒计时或者秒杀已结束-->
        </p>
    </div>

</div>

<!--script 位置-->
</body>
</html>
